.personalCen {
  height: 100vh;
  box-sizing: border-box;
  padding-bottom: 20vw;
  overflow: auto;
}
.personalCen .top {
  background-color: #04D2C3;
  height: 30vw;
  width: 100vw;
  padding: 1vw 5vw 0 5vw;
  position: relative;
  box-sizing: border-box;
}
.personalCen .top .img {
  width: 15vw;
  height: 15vw;
  float: left;
  background-color: #fff;
  border-radius: 15vw;
  margin-right: 1vw;
  border: 1vw solid #5eece2;
}
.personalCen .top .img image {
  width: 15vw;
  height: 15vw;
  border-radius: 15vw;
}
.personalCen .top .info {
  float: left;
  overflow: hidden;
  color: #fff;
  margin: 2.5vw;
}
.personalCen .top .info .name {
  font-size: 4vw;
  margin-bottom: 1.5vw;
}
.personalCen .top .info .name text {
  font-size: 3.2vw;
  color: rgba(255, 255, 255, 0.9);
}
.personalCen .top .info .addr {
  font-size: 3.2vw;
}
.personalCen .top .info .addr .vertical {
  color: rgba(255, 255, 255, 0.7);
}
.personalCen .top .msgTip {
  float: right;
  width: 6vw;
  height: 6vw;
  position: relative;
}
.personalCen .top .msgTip image {
  width: 6vw;
  height: 6vw;
}
.personalCen .top .msgTip .red {
  position: absolute;
  top: 0.5vw;
  right: 0.5vw;
  width: 2vw;
  height: 2vw;
  border-radius: 2vw;
  background-color: #FF3C13;
}
.personalCen .top .round {
  width: 100vw;
  height: 15vw;
  border-radius: 50%;
  background-color: #04D2C3;
  position: absolute;
  bottom: -7.5vw;
  left: 0;
}
.personalCen .top .ol {
  width: 90vw;
  overflow: hidden;
  position: absolute;
  left: 5vw;
  bottom: -15vw;
  height: 23vw;
  padding: 5vw 0;
  box-sizing: border-box;
  border-radius: 2vw;
  background: #fff;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1);
}
.personalCen .top .ol .li {
  text-align: center;
  float: left;
  box-sizing: border-box;
  width: 33.33%;
  position: relative;
}
.personalCen .top .ol .li .num {
  font-size: 4.8vw;
  color: #FFA229;
  font-weight: bold;
}
.personalCen .top .ol .li .wrds {
  margin-top: 2vw;
  font-size: 3.2vw;
  color: #666;
  text-align: center;
}
.personalCen .top .ol .li .wrds .payTip {
  color: #FFA229;
}
.personalCen .top .ol .li:before {
  content: '';
  position: absolute;
  top: 3.2vw;
  left: 0;
  width: 1px;
  height: 6vw;
  background: #ededed;
}
.personalCen .top .ol .li:first-of-type:before {
  display: none;
}
.personalCen .order {
  padding: 18vw 5vw 1vw 5vw;
}
.personalCen .order .title {
  font-size: 3.73vw;
}
.personalCen .order .list {
  display: flex;
  padding: 3vw 0;
  justify-content: space-between;
}
.personalCen .order .list .li {
  width: 20vw;
  text-align: center;
}
.personalCen .order .list .li image {
  width: 6vw;
  height: 6vw;
}
.personalCen .order .list .li view {
  font-size: 3.2vw;
  color: #666666;
}
.personalCen .banner {
  width: 100vw;
  height: 2vw;
  background-color: #F5F5F5;
}
.personalCen .detail {
  padding: 7vw 5vw 0 5vw;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.personalCen .detail .li {
  width: 20vw;
  text-align: center;
  padding: 0;
  margin: 0;
  background-color: #fff;
}
.personalCen .detail .li image {
  width: 6vw;
  height: 6vw;
}
.personalCen .detail .li view {
  font-size: 3.2vw;
  color: #666666;
  margin-bottom: 5vw;
  line-height: 5vw;
}
.personalCen .type {
  overflow: hidden;
  padding: 2vw 5vw 0;
}
.personalCen .type .left {
  width: 44vw;
  float: left;
  position: relative;
}
.personalCen .type .left image {
  width: 100%;
}
.personalCen .type .right {
  width: 44vw;
  float: right;
  position: relative;
}
.personalCen .type .right image {
  width: 100%;
}
.personalCen .type .tip {
  position: absolute;
  top: 3vw;
  left: 3vw;
  color: rgba(255, 255, 255, 0.9);
}
.personalCen .type .tip view:first-child {
  font-size: 4vw;
  line-height: 8vw;
}
.personalCen .type .tip view:last-child {
  font-size: 3.2vw;
}
.personalCen .type .banner {
  width: 100%;
  height: 19vw;
}
.personalCen .type .banner image {
  width: 100%;
}
.gender {
  z-index: 99999999;
}
.gender .fd {
  top: 30vh;
  color: #666;
}
.gender text:first-child {
  padding-bottom: 0;
}
.gender .sel {
  margin: 0 auto;
  overflow: hidden;
}
.gender .sel > view {
  font-size: 3.73vw;
  width: 27vw;
  line-height: 8vw;
  border-radius: 6vw;
  border: 1px solid #00D2C3;
  text-align: center;
  color: #fff;
}
.gender .sel .confirm {
  float: right;
  background-color: #00D2C3;
}
.gender .sel .noConfirm {
  float: left;
  color: #00D2C3;
}
